<template>
  <div class="newclassContainer" v-if="ClassInfo.class_endTime" id="class_new">
    <el-dialog
      :visible.sync="isShow"
      :close-on-click-modal="modalclose"
      custom-class="el-dialog-bg"
      :before-close="handleClose"
    >
      <div
        slot="title"
        class="panel_title"
        v-clipboard:copy="'班级id:'+ClassId+',课程包id:'+ClassInfo.course_package_name.name"
      >
        <span>{{componentname}}</span>
      </div>

      <div class="classinfo">
        <div class="dialog">
          <div class="item">
            <span style="color:red;">*</span>
            <span class="spanlabel">班级名称</span>
            <el-input
              v-model="ClassInfo.class_name.name"
     
              ref="classname"
              style="width:3.5rem;"
              placeholder="请输入内容"
            ></el-input>
          </div>
          <div
            class="item"
            style="display:inline-flex;align-items:flex-start;line-height: 0.12rem;"
          >
            <span class="spanlabel">班级封面图</span>
            <div class="classcover">
              <div class="coverimg">
                <img :src="ClassInfo.class_cover.name" v-if="ClassInfo.class_cover.name" />
                <div v-else class="defaultimg"></div>
              </div>
              <div class="uploadimg">
                <a href="javascript:;" class="file">
                  上传图片
                  <input type="file" name="image" accept="image/*" @change="setImage" />
                </a>
              </div>
            </div>
          </div>
          <div class="item">
            <el-row>
              <el-col :span="9">
                <span style="color:red;">*</span>
                <span class="spanlabel">课程名称</span>
                <el-select
                  v-model="ClassInfo.course_name.name"
                  :disabled="ClassInfo.course_name.editor"
                  ref="coursename"
                  filterable
                  @change="selectCourse"
                  style="width:2rem;"
                  placeholder="请选择"
                >
                  <el-option
                    v-for="item in CoursePakagelist"
                    :key="item.courseId"
                    :label="item.name"
                    :value="item.courseId"
                  ></el-option>
                </el-select>

                <!-- <div id="detailcourse" v-if="ClassInfo.course_type_id.name==2">
			  										<el-select  v-model="detailcourse" @change="changedetail"  @focus="getCourse"     style="width:1rem;" placeholder="详细课程">
													    <el-option										    
													      v-for="item in alldaycourselist"
													      :key="item.libraryCourseId"
													      :label="item.libraryCourseName"
													      :value="item.libraryCourseId">								      	
													    </el-option>									    
			  										</el-select>
                </div>-->

                <div
                  @click.stop="getCourse"
                  v-if="ClassInfo.course_type_id.name==2"
                  style="color:#3296FA;font-size:0.16rem;cursor: pointer;margin-left:0.4rem;"
                >详细课程</div>
                <div class="banner_course_details_item" v-else-if="ClassInfo.course_type_id.name !=2 && ClassInfo.course_type_id.name != '' && alldaycourselist[0] && alldaycourselist[0].isAuthorizeProtected == '1'" style="border-bottom: 0px;margin-left:0.4rem;">
                  <div class="course_name" >
                    <el-checkbox v-model="alldaycourselist[0].isAuthorized" @change="checkChange(alldaycourselist[0])" :disabled="(alldaycourselist[0].availableAuthorizeClassAmount == 0  && !alldaycourselist[0].hasCancle)  ||(ClassInfo.course_type_id.editor)">授权使用课件</el-checkbox>
                  </div>
                  <el-tooltip class="item" effect="light" placement="right">
                    <div slot="content">提示：<br/>该复选框勾选，表示您授权<br/>此班级在V课堂教学客户端<br/>使用课件。<br/>复选框灰色，表示课件无授权<br/>名额，可联系督导老师进行<br/>相关咨询。</div>
                  <div class="course_tips"></div>
                  </el-tooltip>
                </div>
                <div class="banner_course_details" hidden tabindex="2">
                  <div
                    class="banner_course_details_item"
                    v-for="item in alldaycourselist"
                    :key="item.libraryCourseId"
                  >
                  <!-- || (item.availableAuthorizeClassAmount == 0 && item.classCourseAuthorize.isAuthorized == '0' && !item.hasCancle)    || (alldaycourselist[0].availableAuthorizeClassAmount == 0 && alldaycourselist[0].classCourseAuthorize.isAuthorized == '0' && !alldaycourselist[0].hasCancle)   && alldaycourselist[0].classCourseAuthorize == null -->
                    <div class="course_name">
                      {{item.libraryCourseName}}&nbsp;&nbsp;&nbsp;&nbsp;
                      <el-checkbox v-model="item.isAuthorized" @change="checkChange(item)" v-if="item.isAuthorizeProtected == '1'" :disabled="(item.availableAuthorizeClassAmount == 0 &&  !item.hasCancle) || ClassInfo.course_type_id.editor">授权使用课件</el-checkbox>
                    </div>
                     <el-tooltip class="item" effect="light" placement="right" v-if="item.isAuthorizeProtected == '1'">
                    <div slot="content">提示：<br/>该复选框勾选，表示您授权<br/>此班级在V课堂教学客户端<br/>使用课件。<br/>复选框灰色，表示课件无授权<br/>名额，可联系督导老师进行<br/>相关咨询。</div>
                  <div class="course_tips"></div>
                  </el-tooltip>
                  </div>
                </div>
              </el-col>
              <el-col :span="4">
                <span class="spanlabel">科目</span>
                <el-input
                  v-model="ClassInfo.subject_name.name"
                  disabled
                  style="width:1rem;"
                  placeholder
                ></el-input>
              </el-col>
              <el-col :span="6">
                <span class="spanlabel">课程类型</span>
                <el-input
                  v-model="classTypeObj[ClassInfo.course_type_id.name]"
                  disabled
                  style="width:1.5rem;"
                  placeholder
                ></el-input>
              </el-col>
              <el-col :span="5">
                <span class="spanlabel">授课模式</span>
                <el-select
                  v-model="ClassInfo.teach_mode.name"
                  :disabled="ClassInfo.teach_mode.editor"
                  style="width:1rem;"
                >
                  <el-option
                    v-for="item in teachModeList"
                    :key="item.value"
                    :label="item.name"
                    :value="item.value"
                  ></el-option>
                </el-select>
                <!--<el-input v-model="ClassInfo.teach_mode.name"   style="width:1rem;" placeholder=""></el-input>	-->
              </el-col>
            </el-row>
          </div>

          <!--全日制-->
          <div class="item" v-if="ClassInfo.course_type_id.name==2">
            <el-row>
              <el-col :span="8">
                <span style="color:red;">*</span>
                <span class="spanlabel">课程周期</span>
                <el-select
                  v-model="ClassInfo.course_package_name.name"
                  :disabled="ClassInfo.course_package_name.editor"
                  ref="totalCourseHour"
                  @change="SelectCoursePackage"
                  style="width:1.5rem;"
                  placeholder="请选择"
                >
                  <el-option
                    v-for="course in Pakagelist"
                    :key="course.coursePackageId"
                    :label="course.courseTimeModetext"
                    :value="course.coursePackageId"
                  ></el-option>
                </el-select>
              </el-col>
              <el-col :span="16">
                <span style="color:red;">&nbsp;&nbsp;*</span>
                <span class="spanlabel">每天上课时间</span>
                <el-time-select
                  style="width:2rem;"
                  placeholder="开始时间"
                  @change="daytimeChange"
                  v-model="ClassInfo.day_startTime.name"
                  :disabled="ClassInfo.day_startTime.editor"
                  ref="dayStartTime"
                  :picker-options="{
								                            start: minTime,
								                            step: '00:05',
								                            end: maxTime
								                          }"
                ></el-time-select>
                <el-time-select
                  style="width:2rem;"
                  placeholder="结束时间"
                  v-model="ClassInfo.day_endTime.name"
                  :disabled="ClassInfo.day_endTime.editor"
                  ref="dayEndTime"
                  :picker-options="{
								                            start: minTime,
								                            step: '00:05',
								                            end: maxTime
								                          }"
                ></el-time-select>
              </el-col>
            </el-row>
          </div>

          <!--双师/其他-->
          <div class="item" v-else>
            <el-row>
              <el-col :span="12">
                <span style="color:red;">*</span>
                <span class="spanlabel">总课时数</span>
                <el-select
                  v-model="ClassInfo.course_package_name.name"
                  :disabled="ClassInfo.course_package_name.editor"
                  ref="totalCourseHour"
                  @change="SelectCoursePackage"
                  style="width:1.1rem;"
                  placeholder="请选择"
                >
                  <el-option
                    v-for="course in Pakagelist"
                    :key="course.coursePackageId"
                    :label="course.courseHour+'  课时'"
                    :value="course.coursePackageId"
                  ></el-option>
                </el-select>
                <!-- <span class="spanlabel">课时</span> -->
                <!-- <el-select style="width:1.2rem;" ref="syllabusNum" :disabled="ClassInfo.syllabus_num.editor" @change="changeSyllabus" v-model="ClassInfo.syllabus_num.name" placeholder="请选择">
												    <el-option v-for="i in ClassInfo.total_course_num.name" :key="i" :label="i+'节课'" :value="i"></el-option>
                </el-select>-->
                <el-select
                  style="width:1rem;margin-left:0.1rem;"
                  ref="syllabusStartnum"
                  :disabled="ClassInfo.syllabus_start_num.editor"
                  @change="startLesson"
                  v-model="ClassInfo.syllabus_start_num.name"
                  placeholder="请选择"
                >
                  <el-option v-for="i in ClassInfo.maxCourseNum" :key="i" :label="i" :value="i"></el-option>
                </el-select>-
                <el-select
                  style="width:1rem;"
                  ref="syllabusEndnum"
                  disabled
                  v-model="ClassInfo.syllabus_end_num.name"
                  placeholder="请选择"
                >
                  <el-option v-for="i in ClassInfo.maxCourseNum" :key="i" :label="i" :value="i"></el-option>
                </el-select>
              </el-col>
              <el-col :span="6">
                <span style="color:red;">&nbsp;*</span>
                <span class="spanlabel">每次上</span>
                <el-input
                  v-model="ClassInfo.one_hour_time.name"
                  :disabled="ClassInfo.one_hour_time.editor"
                  ref="classhour"
                  style="width:1rem;"
                  placeholder
                ></el-input>
                <span class="spanlabel">课时</span>
              </el-col>
              <el-col :span="6">
                <span style="color:red;">*</span>
                <span class="spanlabel">每课时</span>
                <el-input
                  v-model="ClassInfo.one_mininue.name"
                  :disabled="ClassInfo.one_mininue.editor"
                  ref="minute"
                  style="width:1rem;"
                  placeholder
                ></el-input>
                <span class="spanlabel">分钟</span>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="8" v-if="ClassInfo.course_type_id.name==4">
                <span class="spanlabel">外教类型</span>
                <el-select
                  v-model="ClassInfo.foreignTeacherType.name"
                  :disabled="ClassInfo.foreignTeacherType.editor"
                  style="width:2rem;"
                  placeholder="外教类型"
                >
                  <el-option
                    v-for="item in tempdoubleteacher.foreignTeacherTypelist"
                    :key="item.value"
                    :label="item.name"
                    :value="item.value"
                  ></el-option>
                </el-select>
              </el-col>
            </el-row>
          </div>

          <!--其他-->
          <!-- <div class="item" v-else>
				                	<el-row>			              		
				                		  <el-col :span="8">
					                		  	<span style="color:red;">*</span>
					              				<span class="spanlabel">总课时数</span>
					              				<el-select v-model="ClassInfo.course_package_name.name" :disabled="ClassInfo.course_package_name.editor" ref="totalCourseHour" @change="SelectCoursePackage" style="width:1.5rem;" placeholder="请选择">
												    <el-option
												      v-for="course in Pakagelist"
												      :key="course.coursePackageId"
												      :label="course.courseHour"
												      :value="course.coursePackageId">
												    </el-option>
  												</el-select>
          <!--<el-input v-model="ClassInfo.total_course_num.name" disabled    ref="totalCourseHour"   style="width:1.5rem;" placeholder="请输入课时数"></el-input>-->
          <!--       <span class="spanlabel">课时</span>
				                		  </el-col>
				                		  
				                		  <el-col :span="8">
					                		  	<span style="color:red;">&nbsp;&nbsp;*</span>
					              				<span class="spanlabel">每次上</span>
					              				<el-input v-model="ClassInfo.one_hour_time.name" :disabled="ClassInfo.one_hour_time.editor" ref="classhour" style="width:1.5rem;" placeholder="请输入内容"></el-input>
				                		        <span class="spanlabel">课时</span>
				                		  </el-col>
				                		  <el-col :span="8">
				                		  	    <span style="color:red;">*</span>
					              				<span class="spanlabel">每课时</span>
					              				<el-input v-model="ClassInfo.one_mininue.name" :disabled="ClassInfo.one_mininue.editor" ref="minute" style="width:1.5rem;" placeholder="请输入内容"></el-input>
				                		        <span class="spanlabel">分钟</span>
				                		  </el-col>	
				                		
				                	</el-row>
          </div>-->

          <div class="item">
            <span style="color:red;">*</span>
            <span class="spanlabel">计划招人人数</span>
            <el-input
              v-model="ClassInfo.enrollment_num.name"
              ref="recruit"
              style="width:2.5rem;"
              placeholder="请输入内容"
            ></el-input>
          </div>
          <div class="item">
            <span style="color:red;">*</span>
            <span class="spanlabel">开班时间</span>

            <el-date-picker
              :disabled="ClassInfo.class_startTime.editor"
              ref="startTime"
              @change="selectStartTime"
              v-model="ClassInfo.class_startTime.name"
              type="date"
              value-format="yyyy-MM-dd"
              placeholder="选择日期"
            ></el-date-picker>
            <span class="spanlabel">至</span>
            <el-date-picker
              disabled
              v-if="ClassInfo.course_type_id.name=='2'"
              ref="endTime"
              v-model="ClassInfo.class_endTime.name"
              type="date"
              value-format="yyyy-MM-dd"
              placeholder="选择日期"
            ></el-date-picker>
            <el-date-picker
              v-else
              ref="endTime"
              :disabled="ClassInfo.class_endTime.editor"
              v-model="ClassInfo.class_endTime.name"
              type="date"
              value-format="yyyy-MM-dd"
              placeholder="选择日期"
            ></el-date-picker>
          </div>
          <!--全日制-->
          <div class="item" v-if="ClassInfo.course_type_id.name==2">
            <el-row>
              <el-col :span="8">
                <span class="spanlabel">
                  <label style="color: red;">*</label>教师
                </span>
                <el-select
                  v-model="ClassInfo.teacher.name"
                  filterable
                  ref="teacher"
                  style="width:2rem;"
                  placeholder="请选择"
                >
                  <el-option
                    v-for="item in Teacherlist"
                    :key="item.userId"
                    :label="item.nickName"
                    :value="item.userId"
                  ></el-option>
                </el-select>
              </el-col>
              <el-col :span="8">
                <span class="spanlabel">
                  <label style="color: red;">*</label>助教
                </span>
                <el-select
                  v-model="ClassInfo.assister.name"
                  filterable
                  ref="assisUser"
                  style="width:2rem;"
                  placeholder="请选择"
                >
                  <el-option
                    v-for="item in Teacherlist"
                    :key="item.userId"
                    :label="item.nickName"
                    :value="item.userId"
                  ></el-option>
                </el-select>
              </el-col>
              <el-col :span="8">
                <span class="spanlabel">教室</span>
                <el-select
                  v-model="ClassInfo.classroom.name"
                  filterable
                  clearable
                  ref="classroom"
                  style="width:2rem;"
                  placeholder="请选择"
                >
                  <el-option
                    v-for="item in Classroomlist"
                    :key="item.classroomId"
                    :label="item.name"
                    :value="item.classroomId"
                  ></el-option>
                </el-select>
              </el-col>
            </el-row>
          </div>
          <!--其他-->
          <div class="item" v-else>
            <el-row>
              <el-col :span="8">
                <span class="spanlabel">教师</span>
                <el-select
                  v-model="ClassInfo.teacher.name"
                  filterable
                  clearable
                  ref="teacher"
                  style="width:2rem;"
                  placeholder="请选择"
                >
                  <el-option
                    v-for="item in Teacherlist"
                    :key="item.userId"
                    :label="item.nickName"
                    :value="item.userId"
                  ></el-option>
                </el-select>
              </el-col>
              <el-col :span="8">
                <span class="spanlabel">助教</span>
                <el-select
                  v-model="ClassInfo.assister.name"
                  filterable
                  clearable
                  ref="assisUser"
                  style="width:2rem;"
                  placeholder="请选择"
                >
                  <el-option
                    v-for="item in Teacherlist"
                    :key="item.userId"
                    :label="item.nickName"
                    :value="item.userId"
                  ></el-option>
                </el-select>
              </el-col>
              <el-col :span="8">
                <span class="spanlabel">教室</span>
                <el-select
                  v-model="ClassInfo.classroom.name"
                  filterable
                  clearable
                  ref="classroom"
                  style="width:2rem;"
                  placeholder="请选择"
                >
                  <el-option
                    v-for="item in Classroomlist"
                    :key="item.classroomId"
                    :label="item.name"
                    :value="item.classroomId"
                  ></el-option>
                </el-select>
              </el-col>
            </el-row>
          </div>

          <!--<div class="item">
				                	<span class="spanlabel">班级状态</span>&nbsp;&nbsp;
				                	<el-radio v-model="ClassInfo.class_state.name" disabled  label="1">待开课</el-radio>
		  							<el-radio v-model="ClassInfo.class_state.name" disabled  label="2">上课中</el-radio>
		  							<el-radio v-model="ClassInfo.class_state.name" disabled  label="3">已结课</el-radio>
		  							<el-radio v-model="ClassInfo.class_state.name" disabled  label="4">提前结课</el-radio>
				                </div>
				                
				                <div class="item" v-if="ClassInfo.course_type_id.name!=4">
				                	<span style="color:red;">*</span>
					              	<span class="spanlabel">班级类型&nbsp;&nbsp;</span>
					                <el-radio v-model="ClassInfo.class_type.name" :disabled="ClassInfo.class_type.editor" label="1">线下</el-radio>
		  							<el-radio v-model="ClassInfo.class_type.name" :disabled="ClassInfo.class_type.editor" label="2">线上</el-radio>
				                </div>
				                <div class="item" v-if="ClassInfo.class_type.name==2&&ClassInfo.course_type_id.name!=4">
				                	<span style="color:red;">*</span>
					              	<span class="spanlabel">授课方式&nbsp;&nbsp;</span>
					                <el-radio v-model="ClassInfo.teach_method.name" label="1">网页直播</el-radio>
		  							<el-radio v-model="ClassInfo.teach_method.name" label="2">录播课</el-radio>
				                </div>
				                <div class="item" v-if="ClassInfo.class_type.name==2&&ClassInfo.course_type_id.name!=4">
				                	<span style="color:red;">*</span>
					              	<span class="spanlabel">常规设置&nbsp;&nbsp;</span>
					                <el-radio v-model="ClassInfo.normal_set.name" label="1">课后不允许回放</el-radio>
		  							<el-radio v-model="ClassInfo.normal_set.name" label="2">课后允许回放</el-radio>
          </div>-->
        </div>
      </div>

      <div slot="footer" class="footer-btn">
        <el-button style="margin-top:0.3rem;" @click="btnCancel" class="btnCancel">取 消</el-button>
        <el-button @click="btnOk" class="btnOk">确 定</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import { mapState, mapGetters, mapActions } from "vuex"; //先要引入
let vm;
let $course_details;
export default {
  props: ["componentname"],
  data() {
    return {
      modalclose: false,
      preventrepeat: true, //防重复提交判断
      filedata: null, //待上传的班级版面图
      alldaycourselist: [], //全日制课程详细列表
      detailcourse: "详细课程",
      maxTime: "21:00",
      minTime: "08:00",
      classTypeObj: {}, //课程类型
      teachModeList: [], //授课模式
      tempdoubleteacher: {
        //临时双师字段
        lesson: "", //课节
        startlesson: "", //开始课节
        endlesson: "", //结束课节
        foreignTeacherType: 10, //外教类型
        foreignTeacherTypelist: [] //外教类型列表
      }
    };
  },
  methods: {
    init() {
      if (config.timtlist.length > 0) {
        vm.maxTime = config.timtlist[config.timtlist.length - 1].time;
        vm.minTime = config.timtlist[0].time;
      }

      //获取数据字典
      let dicdata = tool.getItem(lsKey.dict, true);
      vm.tempdoubleteacher.foreignTeacherTypelist =
        dicdata["foreign_teacher_type"]; //排课类型数据字典
      vm.teachModeList = dicdata["course_mode"]; //授课模式
      let classTypelist = dicdata["course_type"]; //排课类型数据字典
      for (let i = 0; i < classTypelist.length; i++) {
        this.classTypeObj[classTypelist[i]["value"]] = classTypelist[i]["name"];
      }
    },
    /**选择课程**/
    selectCourse(val) {
      let index = 0;
      if ($course_details.css("display") != "none") {
        $course_details.fadeOut(300);
      }
		//  vm.alldaycourselist = [];
    //   let courseId = this.ClassInfo.course_name.name;
    //   vm.DetailCourselist(courseId);
      for (let i = 0; i < this.CoursePakagelist.length; i++) {
        //判断选中哪个课程

        if (val == this.CoursePakagelist[i].courseId) {
          index = i;
        }
      }
      console.log(this.CoursePakagelist[index]);
      //课程id
      this.ClassInfo.course_name.name = this.CoursePakagelist[index].courseId;
      //课程下的课程包列表
      this.Pakagelist = this.CoursePakagelist[index].allCoursePackage;
      //默认最大课程包
      this.ClassInfo.course_package_name.name = this.CoursePakagelist[
        index
      ].value;
      //课程包总课时
      this.ClassInfo.total_course_num.name = this.CoursePakagelist[
        index
      ].courseHour;
      //当前课程最大的课时数
      this.ClassInfo.maxCourseNum = this.CoursePakagelist[index].courseHour;
      this.ClassInfo.syllabus_start_num.name = 1;
      this.ClassInfo.syllabus_end_num.name = this.CoursePakagelist[
        index
      ].courseHour;
      //科目名称
      this.ClassInfo.subject_name.name = this.CoursePakagelist[
        index
      ].subjectName;
      //课程类型
      this.ClassInfo.course_type_id.name = this.CoursePakagelist[
        index
      ].courseTypeId;
      //课程类型名称
      this.ClassInfo.course_type.name = getCourseType(
        this.CoursePakagelist[index].courseTypeId
      );
      //授课模式
      this.ClassInfo.teach_mode.name = 1; //getteachMode(this.CoursePakagelist[index].courseMode);

      if (this.ClassInfo.course_type_id.name == 2) {
        //全日制

        this.ClassInfo.courseTimeMode = this.CoursePakagelist[
          index
        ].courseTimeMode;
        if (this.ClassInfo.class_startTime.name != "") {
          this.selectStartTime(this.ClassInfo.class_startTime.name);
        }
        let courseId = this.CoursePakagelist[index].courseId;
      } else if (this.ClassInfo.course_type_id.name == 4) {
        //双师

        this.ClassInfo.one_hour_time.name = 1;
        this.ClassInfo.one_hour_time.editor = true;
        this.ClassInfo.one_mininue.name = this.CoursePakagelist[
          index
        ].perSyllabusDuration;
        this.ClassInfo.one_mininue.editor = true;
        this.ClassInfo.total_course_num.name = this.CoursePakagelist[
          index
        ].syllabusNum;
        this.ClassInfo.syllabus_end_num.name = this.CoursePakagelist[
          index
        ].syllabusEndNum;
        this.ClassInfo.syllabus_start_num.name = this.CoursePakagelist[
          index
        ].syllabusStartNum;
      } else {
        this.ClassInfo.one_hour_time.name = "";
        this.ClassInfo.one_hour_time.editor = false;
        this.ClassInfo.one_mininue.name = this.CoursePakagelist[
          index
        ].perSyllabusDuration;
        this.ClassInfo.one_mininue.editor = true;
      }

      /**
       * 获取课程类型数据字典
       */
      function getCourseType(id) {
        //获取数据字典
        let dicdata = tool.getItem(lsKey.dict, true);
        let coursetype = dicdata["course_type"]; //班级状态数据字典
        let coursetypeName = "";
        for (let i = 0; i < coursetype.length; i++) {
          if (coursetype[i].value == id) {
            coursetypeName = coursetype[i].name;
            break;
          }
        }
        return coursetypeName;
      }
      /**
       * 授课模式
       */
      function getteachMode(id) {
        let modename = "";
        if (id == 1) {
          modename = "大班";
        } else if (id == 2) {
          modename = "中班";
        } else if (id == 3) {
          modename = "小班";
        }

        return modename;
      }
    },

    /**选择课程包**/

    SelectCoursePackage(val) {
      vm.ClassInfo.syllabus_start_num.name = "";
      vm.ClassInfo.syllabus_end_num.name = "";
      let packagelist = this.Pakagelist;

      for (let i = 0; i < packagelist.length; i++) {
        if (packagelist[i].coursePackageId == val) {
          //课程包
          this.ClassInfo.course_package_name.name =
            packagelist[i].coursePackageId;
          //总课时
          this.ClassInfo.total_course_num.name = packagelist[i].courseHour;
          this.ClassInfo.syllabus_num.name = packagelist[i].courseHour;
          this.ClassInfo.syllabus_start_num.name = 1;
          this.ClassInfo.syllabus_end_num.name = packagelist[i].courseHour;
          //周期类型
          this.ClassInfo.courseTimeMode = packagelist[i].courseTimeMode;
          this.selectStartTime(this.ClassInfo.class_startTime.name);
        }
      }
    },
    /**关闭弹出框**/
    handleClose() {
      this.$store.dispatch("createNewClass/hidecreateClassPanel");
    },
    /**关闭弹出框**/
    btnCancel() {
      this.$store.dispatch("createNewClass/hidecreateClassPanel");
    },
    /**一天开始的时间**/
    daytimeChange(val) {
      if (val >= "17:00") {
        this.ClassInfo.day_endTime.name = "21:00";
      } else {
        this.ClassInfo.day_endTime.name = "17:00";
      }
    },
    /** 选取班级图片**/

    setImage(e) {
      const file = e.target.files[0];
      if (!file.type.includes("image/")) {
        alert("Please select an image file");
        return;
      }
      vm.filedata = new FormData(); //创建form对象
      vm.filedata.append("file", file, file.name); //通过append向form对象添加数据
      vm.filedata.append("content", "studentIcon"); //添加form表单中其他数据
      //console.log(param.get('file')); //FormData私有类对象，访问不到，可以通过get判断值是否传进去
      if (typeof FileReader === "function") {
        //生成本次url

        const reader = new FileReader();

        reader.onload = event => {
          vm.ClassInfo.class_cover.name = event.target.result;
          //	console.log(vm.ClassInfo)
        };
        reader.readAsDataURL(file);
      } else {
        alert("Sorry, FileReader API not supported");
      }
    },
    /**确定新建更新班级信息**/
    btnOk() {
      /**
       *  总课时数：最大值300
       *	每次课时数：最大值24
       *	每课时分钟数：最大值300
       *	计划招生人数：最大值999
       */
      //验证
      let classname = this.$refs.classname; //班级名称
      let coursename = this.$refs.coursename; //课程名称
      let classhour; //课时数
      let totalCourseHour; //总课时数
      let minute; //分钟数
      let dayStartTime; //开始时间
      let dayEndTime; //结束时间
      let recruit = this.$refs.recruit; //计划招人数
      let startTime = this.$refs.startTime; //开班时间
      let endTime = this.$refs.endTime; //结束时间
      let syllabusNum = this.$refs.syllabusNum; //双师 上课课节
      let syllabusStartnum = this.$refs.syllabusStartnum; //双师 上课课节
      let syllabusEndnum = this.$refs.syllabusEndnum; //双师 上课课节
      let teacher = this.$refs.teacher; //全日制教师校验
      let assister = this.$refs.assisUser; //全日制助教校验
      let rules = [];

      //班级名称
      rules.push({
        judge: tool.judge("classname", classname.value),
        focus: classname,
        tips: tips.classname
      });
      // debugger
      //班级封面
      if (
        this.ClassInfo.course_type_id.name == 5 &&
        this.ClassInfo.class_cover.name == ""
      ) {
        //线上必须有封面
        rules.push({
          judge: null,
          focus: null,
          tips: "请上传班级封面图片"
        });
      }
      //课程名称
      if (coursename.value == "") {
        rules.push({
          judge: null,
          focus: coursename,
          tips: "请选择课程"
        });
      }

      if (vm.ClassInfo.course_type_id.name == "3") {
        //普通班课

        classhour = this.$refs.classhour; //课时数
        totalCourseHour = this.$refs.totalCourseHour; //总课时数
        minute = this.$refs.minute; //分钟数

        if (this.ClassInfo.total_course_num.name % classhour.value != 0) {
          rules.push({
            judge: null,
            focus: classhour,
            tips: "总课时需是课时数的整数倍"
          });
        }
        // debugger;
        //课时数
        rules.push({
          judge: tool.judge("integer", classhour.value),
          focus: classhour,
          tips: tips.integer
        });
        if (classhour.value <= 0 || classhour.value > 24) {
          rules.push({
            judge: null,
            focus: classhour,
            tips: "每次课时数限1-24"
          });
        }
        //分钟数
        rules.push({
          judge: tool.judge("integer", minute.value),
          focus: minute,
          tips: tips.integer
        });

        if (minute.value <= 0 || minute.value > 300) {
          rules.push({
            judge: null,
            focus: minute,
            tips: "每课时分钟数限1-300"
          });
        }
      } else if (vm.ClassInfo.course_type_id.name == "2") {
        //全日制

        dayStartTime = this.$refs.dayStartTime; //开始时间
        dayEndTime = this.$refs.dayEndTime; //结束时间

        if (dayStartTime.value == "") {
          rules.push({
            judge: null,
            focus: dayStartTime,
            tips: "请选择开始时间"
          });
        }
        if (dayEndTime.value == "") {
          rules.push({
            judge: null,
            focus: dayEndTime,
            tips: "请选择结束时间"
          });
        }
        if (dayEndTime.value <= dayStartTime.value) {
          rules.push({
            judge: null,
            focus: dayEndTime,
            tips: "结束时间不能小于等于开始时间"
          });
        }

        if (teacher.value == "") {
          rules.push({
            judge: null,
            focus: teacher,
            tips: "请选择教师"
          });
        }
        if (assister.value == "") {
          rules.push({
            judge: null,
            focus: assister,
            tips: "请选择助教"
          });
        }
        //else if(vm.ClassInfo.course_type_id.name=='4')
      } else {
        let maxValue = Number(vm.ClassInfo.total_course_num.name);
        //  let syllabusNumValue = syllabusNum.value;//双师 上课课节
        let syllabusStartnumValue = syllabusStartnum.value; //双师 上课课节
        let syllabusEndnumValue = syllabusEndnum.value; //双师 上课课节
        let minuNum = syllabusEndnumValue - syllabusStartnumValue + 1;
        //开始课节不能小于结束课节
        if (syllabusStartnumValue > syllabusEndnumValue) {
          rules.push({
            judge: null,
            focus: syllabusStartnum,
            tips: "开始课时不能大于结束课时"
          });
        }
        //开始课节至结束课节数等于总课节数
        if (minuNum != maxValue) {
          rules.push({
            judge: null,
            focus: syllabusStartnum,
            tips: "课时不足"
          });
        }
      }

      //计划招人

      rules.push({
        judge: tool.judge("integer", recruit.value),
        focus: recruit,
        tips: tips.integer
      });

      if (recruit.value <= 0 || recruit.value > 999) {
        rules.push({
          judge: null,
          focus: recruit,
          tips: "招生人数限1-999人"
        });
      }
      //alert(startTime.value)
      //开课时间
      rules.push({
        judge: startTime.value,
        focus: startTime,
        tips: "请选择开课时间"
      });
      //结束时间
      rules.push({
        judge: endTime.value,
        focus: endTime,
        tips: "请选择结课时间"
      });
      //判断开课时间与结束时间

      if (endTime.value < startTime.value) {
        rules.push({
          judge: null,
          focus: startTime,
          tips: "结课时间不能小于开课时间"
        });
      }
      if (this.ClassInfo.coursenametext == "") {
        rules.push({
          judge: null,
          focus: null,
          tips: "请先创建课程"
        });
      }
      let timelen = tool.TimeSpan(startTime.value, endTime.value);
      if (timelen > 36) {
        rules.push({
          judge: null,
          focus: null,
          tips: "班级开课时间跨度最大为3年"
        });
      }

      if (!tool.validate(rules)) {
        return;
      }

      let paras = {
        campusId: vm.$store.state.campusId,
        className: this.ClassInfo.class_name.name || "",
        courseMode: this.ClassInfo.teach_mode.name || 1,
        coursePackageId: this.ClassInfo.course_package_name.name,
        totalCourseHour: this.ClassInfo.total_course_num.name || 0,
        oneCourseHour: this.ClassInfo.one_hour_time.name || 1,
        oneCourseHourMinute: this.ClassInfo.one_mininue.name,
        recruitNum: this.ClassInfo.enrollment_num.name || 0,
        startTime: this.ClassInfo.class_startTime.name || "",
        endTime: this.ClassInfo.class_endTime.name || "",
        teacherUserId: this.ClassInfo.teacher.name || "",
        classRoomId: this.ClassInfo.classroom.name || "",
        assisUserId: this.ClassInfo.assister.name || "",
        classStatusMode: this.ClassInfo.class_state.name,
        photo: this.ClassInfo.class_cover.name || "",
        classTypeMode: this.ClassInfo.class_type.name || "1",
        classTeachingMode: this.ClassInfo.teach_method.name || "1",
        classReplayMode: this.ClassInfo.normal_set.name || "1",
		foreignTeacherType: this.ClassInfo.foreignTeacherType.name || 10,
		libraryCourseCampusList:[]
	  };
	  
		
      if (vm.ClassInfo.course_type_id.name == "2") {
        paras.dayStartTime = this.ClassInfo.day_startTime.name || "";
        paras.dayEndTime = this.ClassInfo.day_endTime.name || "";
      }
      // else if(vm.ClassInfo.course_type_id.name=='4'){

      // 	paras.syllabusStartNum = this.ClassInfo.syllabus_start_num.name;
      // 	paras.syllabusEndNum = this.ClassInfo.syllabus_end_num.name;
      // 	paras.totalCourseHour = (paras.syllabusEndNum-paras.syllabusStartNum)+1;
      // }
      else {
        paras.syllabusStartNum = this.ClassInfo.syllabus_start_num.name;
        paras.syllabusEndNum = this.ClassInfo.syllabus_end_num.name;
        paras.totalCourseHour =
          paras.syllabusEndNum - paras.syllabusStartNum + 1;
      }

      if (this.componentname == "新建班级") {
		  console.log(vm.alldaycourselist);
	  /**课件保护 */
	  vm.alldaycourselist.forEach((item)=>{
		  paras.libraryCourseCampusList.push({
			  libraryCourseCampusId:item.libraryCourseCampusId,
			  libraryCourseId:item.libraryCourseId,
			  availableAuthorizeClassAmount:item.availableAuthorizeClassAmount,
			  isAuthorized:item.isAuthorized?1:0,
			  isAuthorizeProtected:item.isAuthorizeProtected
		  })
	  });
        //新建班级

        if (vm.filedata == null) {
          if (vm.preventrepeat) {
            vm.preventrepeat = false;
            api
              .addClass(paras)
              .then(function(data) {
                if (data.result == "操作成功") {
                  if (data.resultCode == 2000) {
                    vm.preventrepeat = true;
                    vm.$message({
                      message: "新建班级成功",
                      type: "success"
                    });
                    if (vm.$parent.menu == 1) {
                      vm.$parent.searchData(1); //刷新父组件
                    } else {
                      vm.$parent.selectOverClassData(1);
                    }
                    vm.$store.dispatch("createNewClass/hidecreateClassPanel");
                  } else {
                    vm.preventrepeat = true;
                    vm.$message({
                      message: data.message,
                      type: "warning"
                    });
                  }
                } else {
                  vm.preventrepeat = true;
                  vm.$message({
                    message: "班级已存在",
                    type: "warning"
                  });
                }
              })
              .catch(function(e) {
                vm.preventrepeat = true;
              });
          }
        } else {
          if (vm.preventrepeat) {
            vm.preventrepeat = false;
            api
              .uploadFile(vm.filedata)
              .then(function(data) {
                if ((data.result = "操作成功")) {
                  paras.photo = data.url;
                }
                return api.addClass(paras);
              })
              .then(function(data) {
                if (data.result == "操作成功") {
                  vm.$message({
                    message: "新建班级成功",
                    type: "success"
                  });
                  vm.preventrepeat = true;
                  if (vm.$parent.menu == 1) {
                    vm.$parent.searchData(1); //刷新父组件
                  } else {
                    vm.$parent.selectOverClassData(1);
                  }
                  vm.$store.dispatch("createNewClass/hidecreateClassPanel");
                } else {
                  vm.preventrepeat = true;
                  vm.$message({
                    message: "班级已存在",
                    type: "warning"
                  });
                }
              })
              .catch(function(e) {
                vm.preventrepeat = true;
              });
          }
        }
      } else if (this.componentname == "班级信息编辑") {
		  
		  vm.alldaycourselist.forEach((item)=>{
        if(item.isAuthorizeProtected == "1"){
            item.classCourseAuthorize = item.classCourseAuthorize !=null?item.classCourseAuthorize: {};
            item.classCourseAuthorize.isAuthorized = item.isAuthorized?'1':'0';
          
          }
	  			});
	  		console.log(vm.alldaycourselist);
		   paras.libraryCourseCampusList = vm.alldaycourselist;
        //班级编辑
        paras.classId = vm.ClassId + "";
        if (vm.filedata == null) {
          if (vm.preventrepeat) {
            vm.preventrepeat = false;
            api
              .editorClass(paras)
              .then(function(data) {
                if (data.result == "操作成功") {
                  vm.$message({
                    message: "修改成功",
                    type: "success"
                  });
                  vm.preventrepeat = true;
                  console.log(vm.$parent);
                  if (vm.$parent.menu == 1) {
                    vm.$parent.searchData(1); //刷新父组件
                  } else {
                    vm.$parent.selectOverClassData(1);
                  }

                  vm.$store.dispatch("createNewClass/hidecreateClassPanel");
                } else {
                  vm.preventrepeat = true;
                  vm.$message({
                    message: data.result,
                    type: "warning"
                  });
                }
              })
              .catch(function(e) {
                vm.preventrepeat = true;
              });
          }
        } else {
          if (vm.preventrepeat) {
            vm.preventrepeat = false;
            api
              .uploadFile(vm.filedata)
              .then(function(data) {
                if ((data.result = "操作成功")) {
                  paras.photo = data.url;
                }
                return api.editorClass(paras);
              })
              .then(function(data) {
                //console.log(data)
                if (data.result == "操作成功") {
                  vm.$message({
                    message: "修改成功",
                    type: "success"
                  });
                  vm.preventrepeat = true;
                  if (vm.$parent.menu == 1) {
                    vm.$parent.searchData(1); //刷新父组件
                  } else {
                    vm.$parent.selectOverClassData(1);
                  }
                  vm.$store.dispatch("createNewClass/hidecreateClassPanel");
                } else {
                  vm.preventrepeat = true;
                  vm.$message({
                    message: data.result,
                    type: "warning"
                  });
                }
              })
              .catch(function(e) {
                vm.preventrepeat = true;
              });
          }
        }
      }
    },
    /**全日制选择开始时间**/

    selectStartTime(val) {
      if (vm.ClassInfo.course_type_id.name == "2") {
        let curdate = new Date(val);

        //计算全日制班级结束时间
        let inx = this.ClassInfo.courseTimeMode;
        switch (inx) {
          case 1: {
            //年

            let num = 12 * vm.ClassInfo.total_course_num.name;
            curdate.setMonth(curdate.getMonth() + num);
            let newdate = tool.DateToString(curdate, "yyyy-MM-dd");
            vm.ClassInfo.class_endTime.name = newdate;
            break;
          }
          case 2: {
            //半年

            let num = 6 * vm.ClassInfo.total_course_num.name;
            curdate.setMonth(curdate.getMonth() + num);
            let newdate = tool.DateToString(curdate, "yyyy-MM-dd");
            vm.ClassInfo.class_endTime.name = newdate;
            break;
          }
          case 3: {
            //季

            let num = 3 * vm.ClassInfo.total_course_num.name;
            curdate.setMonth(curdate.getMonth() + num);
            let newdate = tool.DateToString(curdate, "yyyy-MM-dd");
            vm.ClassInfo.class_endTime.name = newdate;
            break;
          }
          case 4: {
            //月

            let num = 1 * vm.ClassInfo.total_course_num.name;
            curdate.setMonth(curdate.getMonth() + num);
            let newdate = tool.DateToString(curdate, "yyyy-MM-dd");
            vm.ClassInfo.class_endTime.name = newdate;
            break;
          }
          case 5: {
            //周
            //alert(vm.ClassInfo.total_course_num.name)
            let num = 7 * vm.ClassInfo.total_course_num.name;
            //alert(num)
            curdate.setDate(curdate.getDate() + num);
            let newdate = tool.DateToString(curdate, "yyyy-MM-dd");
            vm.ClassInfo.class_endTime.name = newdate;
            break;
          }
        }
      }
    },
    changeSyllabus(val) {
      vm.ClassInfo.syllabus_start_num.name = "";
      vm.ClassInfo.syllabus_end_num.name = "";
    },
    /**开始课节**/
    startLesson(val) {
      let maxValue = Number(vm.ClassInfo.total_course_num.name);
      vm.ClassInfo.syllabus_end_num.name = val + maxValue - 1;

      if (vm.ClassInfo.maxCourseNum < vm.ClassInfo.syllabus_end_num.name) {
        vm.ClassInfo.syllabus_start_num.name = 1;
        vm.ClassInfo.syllabus_end_num.name = maxValue;
        vm.$message({
          message: "课时不足",
          type: "warning"
        });
      }

      //ClassInfo.syllabus_start_num.name
    },
    /**全日制改变课时**/

    changeCourseHour(val) {
      if (
        vm.ClassInfo.course_type_id.name == "2" &&
        vm.ClassInfo.class_startTime.name != ""
      ) {
        let curdate = new Date(vm.ClassInfo.class_startTime.name);
        let curday = curdate.getDay(); //原本天
        let num = Number(val) || 0;
        curdate.setDate(curdate.getDate() + num);
        let newdate = tool.DateToString(curdate, "yyyy-MM-dd");
        vm.ClassInfo.class_endTime.name = newdate;
      }
    },
    /**全日制详细课程列表* */

    DetailCourselist(courseId) {
		let param={};
      if (this.componentname == "新建班级") {
	  	  param = { courseId: courseId, campusId: vm.$store.state.campusId };
	  }else{
		  param = { classId: vm.ClassId, campusId: vm.$store.state.campusId };
	  }
      api.getListAuthorizationOfCourse(param).then(function(data) {
        if (data.result == "操作成功") {
			data.list.forEach((item)=>{
        item.isAuthorized = item.classCourseAuthorize && item.classCourseAuthorize.isAuthorized == "1" ?true:false;
        item.hasCancle = item.classCourseAuthorize && item.classCourseAuthorize.isAuthorized == "1" ?true:false;
			})
          vm.alldaycourselist = data.list;
          console.log(vm.alldaycourselist);
        }
      });
	},
	checkChange(item){
		if(item.isAuthorized){
      item.availableAuthorizeClassAmount = item.availableAuthorizeClassAmount-1;
      if(item.availableAuthorizeClassAmount == 0){
        item.hasCancle = true;
      }
      
		}else{
			item.availableAuthorizeClassAmount = item.availableAuthorizeClassAmount+1;
		}
	},
    /**获取详细课程**/
    getCourse() {
		if ($course_details.css("display") == "none") {
        $course_details.fadeIn(300);
        $course_details.focus();
      } else {
        $course_details.fadeOut(300);
        return;
      }
     
    },
    /**详细课程改变**/
    changedetail(val) {
      vm.detailcourse = "详细课程";
      console.log(vm.ClassInfo);
    },
    /**
     * 复制班级id
     */
    CopyClassId() {}
  },
  computed: {
    ...mapState({
      isShow: state => state.createNewClass.createClassDialog,
      Teacherlist: state => state.commondata.teacherlist,
      Classroomlist: state => state.commondata.classroomlist,
      CoursePakagelist: state => state.commondata.coursePakagelist,
      CoursePakageAlllist: state => state.commondata.coursePakageAlllist
    }),
    ...mapGetters("createNewClass", {
      ClassInfo: "getClassInfo",
      ClassId: "getClassId"
    }),

    disable: function() {
      if (this.componentname == "新建班级") {
        return true;
      } else {
        return false;
      }
    },
    Pakagelist: {
      get: function() {
        let list = [];
        if (vm.CoursePakagelist == "undefined") {
          alert(vm.CoursePakagelist);
          return;
        }
        //   console.log(vm.CoursePakagelist);
        vm.alldaycourselist = [];
        let courseId = this.ClassInfo.course_name.name;
        if(courseId != ""){
          vm.DetailCourselist(courseId);
        }
        for (let i = 0; i < vm.CoursePakagelist.length; i++) {
          if (
            vm.ClassInfo.course_name.name == vm.CoursePakagelist[i].courseId
          ) {
            // 		vm.tempdoubleteacher.foreignTeacherType =  vm.ClassInfo.foreignTeacherType;
            //  console.log(vm.tempdoubleteacher.foreignTeacherType);
            vm.ClassInfo.maxCourseNum = vm.CoursePakagelist[i].courseHour;
            list = vm.CoursePakagelist[i].allCoursePackage;
            for (let j = 0; j < list.length; j++) {
              if (
                this.ClassInfo.course_package_name.name ==
                list[j].coursePackageId
              ) {
                this.ClassInfo.courseTimeMode = list[j].courseTimeMode;
              }
              if (list[j].courseTimeMode == 1) {
                list[j].courseTimeModetext = list[j].courseHour + "年";
              } else if (list[j].courseTimeMode == 2) {
                list[j].courseTimeModetext = list[j].courseHour + "半年";
              } else if (list[j].courseTimeMode == 3) {
                list[j].courseTimeModetext = list[j].courseHour + "季";
              } else if (list[j].courseTimeMode == 4) {
                list[j].courseTimeModetext = list[j].courseHour + "月";
              } else if (list[j].courseTimeMode == 5) {
                list[j].courseTimeModetext = list[j].courseHour + "周";
              }
            }
          }
        }
        return list;
      },
      set: function(data) {}
    }
  },
  watch: {
    isShow: function(val1, val2) {
      this.$nextTick(function() {
        if (val1) {
          $course_details = $("#class_new .banner_course_details");
          // $course_details.blur(function() {

          // });
        }
      });
    }
  },
  mounted() {
    vm = this;

    vm.init();
  }
};
</script>

<style lang="scss">
@import "@/style/module/utils.scss";
.newclassContainer {
  .classinfo {
    width: 100%;
    max-height: 10rem;
    padding: 0 0.31rem;
    .item {
      width: 100%;
      float: left;
      max-height: 2rem;
      line-height: 0.571rem;
      .banner_course_details {
        position: absolute;
        top: 1rem;
        left: 0rem;

        border-radius: 0.04rem;
        background-color: #ffffff;
        -webkit-box-shadow: 0 0.02rem 0.12rem 0 rgba(0, 0, 0, 0.1);
        box-shadow: 0 0.02rem 0.12rem 0 rgba(0, 0, 0, 0.1);
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        border: solid 0.01rem #e4e7ed;
        z-index: 99;
      }
      .banner_course_details:focus {
        outline: none;
      }
      .banner_course_details_item {
        padding: 0.08rem 0.12rem;
        height: 0.4rem;
        line-height: 0.44rem;
        font-size: 0.16rem;
        color: #606266;
        border-bottom: 1px solid #eeeeee;
        overflow: hidden;
		
        .el-checkbox__label {
          font-size: 0.16rem;
        }
        .course_tips {
          float: left;
          width: 0.16rem;
          height: 0.16rem;
          margin-left: 0.06rem;
          margin-top: 0.04rem;
          background-image: url(../../../assets/img/education_manage/course_tip.png);
        }
        .course_name {
          float: left;
          margin-top: -0.1rem;
        }
      }
      #detailcourse {
        display: inline;
        .el-input__inner {
          border: none !important;
          padding: 0px;
          color: #3296fa;
        }
        .el-input__suffix {
          display: none;
        }
      }
      .classcover {
        height: 1rem;
        display: flex;
        .coverimg {
          .defaultimg {
            width: 1.5rem;
            height: 1rem;
            background: #d0eeff;
            background: url("~@/assets/img/education_manage/default.png");
            background-size: 1.5rem 1rem;
          }
          margin: 0rem 0.05rem;
          max-height: 1.02rem;
          img {
            max-width: 6rem;
            height: 1rem;
          }
        }
        .uploadimg {
          height: 0.3rem;
          text-align: center;
          line-height: 0.3rem;
          margin-top: 0.1rem;
          align-self: flex-end;
          .file {
            position: relative;
            display: inline-block;
            background: #d0eeff;
            border: 1px solid #99d3f5;
            border-radius: 0.3rem;
            padding: 4px 30px;
            overflow: hidden;
            color: #1e88c7;
            text-decoration: none;
            text-indent: 0;
            line-height: 20px;
          }
          .file input {
            position: absolute;
            font-size: 100px;
            right: 0;
            top: 0;
            opacity: 0;
          }
          .file:hover {
            background: #aadffd;
            border-color: #78c3f3;
            color: #004974;
            text-decoration: none;
          }
        }
      }
    }
  }
  .footer-btn {
    .btnOk {
      width: 1.6rem;
      height: 0.4rem;
      font-size: 0.16rem;
      background: #3885f8;
      color: #ffffff;
      border-radius: 0.1rem;
    }
    .btnCancel {
      width: 1.6rem;
      height: 0.4rem;
      font-size: 0.16rem;
      background: #ffffff;
      color: #333333;
      border-radius: 0.1rem;
    }
  }
  /**自定义对话框标题样式**/
  .panel_title {
    padding: 0.23rem 0.31rem 0.23rem 0.31rem;
    font-size: 0.22rem;
    font-family: "microsoft yahei";
    color: #333333;
  }

  /**
		 * 全日制课程详细列表
		 */
  .detailcourselist {
    height: auto;
    min-width: 1.5rem;
    transform-origin: center top;
    position: absolute;
    z-index: 3000;
    margin-left: -1.5rem;
    margin-top: -1rem;
    top: 3.67rem;
    left: 6.55rem;
    display: none;
    background: #ffffff;
    border: 0.01rem solid #dfdfdf;
    .body {
      overflow: hidden;
      position: relative;

      .scrollbar {
        overflow: scroll;
        max-height: 2.6rem;
        &::-webkit-scrollbar {
          width: 0.03rem;
          height: 0;
        }
        &::-webkit-scrollbar-thumb {
          border-radius: 0.03rem;
          /*   background: #3885F8;*/
        }
        ul {
          list-style: none;
          padding: 0.06rem 0;
          margin: 0;
          -webkit-box-sizing: border-box;
          box-sizing: border-box;
          .li {
            font-size: 0.16rem;
            padding: 0 0.2rem;
            position: relative;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
            color: #606266;
            height: 0.34rem;
            line-height: 0.34rem;
            -webkit-box-sizing: border-box;
            box-sizing: border-box;
            cursor: pointer;
          }
        }
      }
      /*.li{
					height: 0.3rem;
					line-height: 0.3rem;
					color: #3c3c3c;
    				font-size: 0.14rem;
    				border-bottom: 1px solid #EBEBEB;
				}*/
    }
  }
  /**
		 * 自定义对话框样式
		 */
  .el-dialog-bg {
    background: #ffffff;
    width: 10rem;
    border-radius: 0.1rem;
    /*margin-top: 5vh !important;*/
    .el-dialog__header {
      padding: 0px;
    }
    .el-dialog__body {
      padding: 0px !important;
    }
    .el-dialog__footer {
      padding: 0.3rem;
      .footer-btn {
        width: 100%;
        text-align: center;
      }
    }
  }
  .el-dialog-bg2 {
    background: #ffffff;
    width: 3rem !important;
    border-radius: 0.1rem;
    margin-top: 30vh !important;
    height: 1rem;
    line-height: 1rem;
    text-align: center;
    color: #333333;

    .el-dialog__header {
      padding: 0px;
    }
    .el-dialog__body {
      padding: 0px !important;
      font-size: 0.16rem !important;
    }
    .el-dialog__footer {
      padding: 0.3rem;
      .footer-btn {
        width: 100%;
        text-align: center;
      }
    }
  }
}
</style>